<div class="l-title-group">
    <dl><dt>{{data.type}}</dt></dl>
    <button (click)="onClose()"></button>
</div>
<div class="l-contents-group">
    <dl class="l-sql-list" [hidden]="!hasBind()">
        <dt>Binded {{data.type}}</dt>
        <dd>
            <pre><code highlight [textContent]="data.bindedContents"></code></pre>
            <button class="btn active" (click)="onCopyBindedContents()">Copy</button>
        </dd>
    </dl>
    <dl class="l-sql-list">
        <dt>Original {{data.type}}</dt>
        <dd>
            <pre><code highlight [textContent]="data.originalContents"></code></pre>
            <button class="btn active" (click)="onCopyOriginalContents()">Copy</button>
        </dd>
    </dl>
    <dl class="l-sql-list" [hidden]="!hasBind()">
        <dt>{{data.type}} Bind Value</dt>
        <dd>
            {{data.bindValue}}
            <button class="btn active" (click)="onCopyBindValue()">Copy</button>
        </dd>
    </dl>
</div>
